<!DOCTYPE html>
<html>
    <head>
        <title>$$$￥￥￥</title>
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
        <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <script src="../node_modules/_vue@2.6.14@vue/dist/vue.min.js"></script>
    </head>
    <body>
         <div id="box">
         <!-- 如果给一个复选框绑定一个变量  那么这个变量会随着勾选和取消在true和false中切换 -->
         <input type="checkbox" v-model="bool"/>{{bool?"显示":"隐藏"}}
         <h1 v-show="bool">显示</h1>
         </div>
    </body>
    <script>
        new Vue({
            data:{
                bool:true
            },
            el:"#box"
        })
    </script>
</html>